<template>
    <a-card :bordered="false">
        <a-list
                :header="`${evaluates.length} 条评论`"
                item-layout="horizontal"
                :data-source="evaluates"
        >
            <a-list-item slot="renderItem" slot-scope="item">
                <a-comment>
                    <p slot="author" style="font-size: 18px">
                        {{ item.memberRole }}
                    </p>
                    <p slot="content" :style="`font-size: 18px; color: ${item.color}`">
                        {{ item.comment }}
                    </p>
                    <a-tooltip slot="datetime" :title="item.time.format('YYYY-MM-DD HH:mm:ss')">
                        <span style="font-size: 14px">{{ item.time.fromNow() }}</span>
                    </a-tooltip>
                </a-comment>
            </a-list-item>
        </a-list>
    </a-card>
</template>

<script>
    export default {
        name: "EvaluateList",
        props: {
           evaluates: {
               type: Array,
               default: () => []
           }
        }
    }
</script>
